<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>  
<%
	String contextPath = request.getContextPath();
%>

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="../css/main.css" />
<link rel="stylesheet" type="text/css" href="../css/sub.css" />
<link rel="stylesheet" type="text/css" href="../css/all_menu.css" />
<script src = "http://code.jquery.com/jquery-1.10.1.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600' rel='stylesheet' type='text/css'>
<!-- <script src="http://www.wedaehan.com/js/jquery-1.8.3.min.js"></script>
<script src="http://www.wedaehan.com/js/jquery.menu.js"></script>
<script src="http://www.wedaehan.com/js/jquery.easing.min.js"></script>
<script src="http://www.wedaehan.com/js/jquery.touchSlider.js"></script>
<script src="http://www.wedaehan.com/js/common.js"></script>
<script src="http://www.wedaehan.com/js/wrest.js"></script>
<script src="http://www.wedaehan.com/js/jquery.reveal.js"></script>
<script src="http://www.wedaehan.com/js/smooth_scroll.js"></script> -->
<script type="text/javascript">

	$(document).ready(function(){
		$('#choice').click(function(){
			var index = $('#point:checked').val();
			alert(index);
			$('#amount').val(index);
			$('#choice').attr('style','display:none;');
			$('#cansel').attr('style','display:block;');
		});
	});
</script>

<script type="text/javascript">
if(typeof EL_GUL == 'undefined'){
var EL_GUL = 'dgc11.acecounter.com';var EL_GPT='8080'; var _AIMG = new Image(); var _bn=navigator.appName; var _PR = location.protocol=="https:"?"https://"+EL_GUL:"http://"+EL_GUL+":"+EL_GPT;if( _bn.indexOf("Netscape") > -1 || _bn=="Mozilla"){ setTimeout("_AIMG.src = _PR+'/?cookie';",1); } else{ _AIMG.src = _PR+'/?cookie'; };
document.writeln("<scr"+"ipt language='javascript' src='/acecounter/acecounter_V70.js'></scr"+"ipt>");
}
</script>

<script type="text/javascript">
/* <![CDATA[ */
var google_conversion_id = 967057890;
var google_conversion_label = "A9o3CIaS9wcQ4sOQzQM";
var google_custom_params = window.google_tag_params;
var google_remarketing_only = true;
/* ]]> */
</script>
<script>
// 자바스크립트에서 사용하는 전역변수 선언
var g5_url       = "http://www.wedaehan.com";
var g5_bbs_url   = "http://www.wedaehan.com/bbs";
var g5_is_member = "1";
var g5_is_admin  = "";
var g5_is_mobile = "";
var g5_bo_table  = "";
var g5_sca       = "";
var g5_editor    = "ckeditor43";
var g5_cookie_domain = "";
</script>
<title>결제목록</title>
</head>
<body>
<hr>

<!-- //Wrapper -->
<div id="wrapper">	
	<!-- Contenter_Sub -->
	<div id="container_sub">
		
		<!-- Content_List -->
		<div id="sub_page_bg1"></div><!-- Sub Page Background -->
		
		<div id="content_list">

			<div class="title">
						<div class='sub_title'><li>MY 결제내역</li><li class='stitle'>결제내역 정보를 마이페이지에서 확인하세요.</li></div><div class='navig'><li class='frst'><img src='../image/all/home_icon.png' align='absmiddle' width='13' height='13'> <a href='/'>HOME</a></li><li>우리결혼할래요</li><li>MY결제내역</li></div>
		<!-- sub_menu-->
		<ul class='sub_menu'>		
				<ul class="sub_tab">
			<li><a class='rollover' href="<%=contextPath%>/member/myPage.do?id=${id}">내 정보</a></li>
			<li><a class='over' href="<%=contextPath%>/member/paymentList.do">결제내역</a></li>
			<li><a class='rollover' href="<%=contextPath%>/member/myTicketList.do">My Ticket</a></li>
			<li><a class='rollover' href="<%=contextPath%>/matching/sendPropose.do?id=${id}">MY PROPOSE</a></li>
			<li><a class='rollover' href="<%=contextPath%>/member/sendSmsList.do">쪽지함</a></li>
		</ul>
	</ul>				</div>

	
		
<div class="content_title">
	<h1><span>WHY?</span><br>GREAT<br>DATE<br>SERVICE</h1>
	<p><br>━</p>
	<span class="content_title_s"><strong>GREAT DATE SERVICE</strong><br><br>우리 결혼할래요와 함께<br>당신의 이상형을 찾아 드립니다.</span>
	<br><br>

	<img src="../img/left_banner.jpg" />
</div>
<form:form commandName="paymentCommand">
<div style="height:500px; padding-right:0px; ">
<div class="great_date1">
<h2>POINT 충전</h2>
	<br><br>
	<div class="tbl_head01 tbl_wrap2">
	
	<table id="ptbl">
		<tr>
			<td colspan="3" style="text-align:center; background-color:#5E636C;">1. 결제 금액을 선택해주세요</td>
		</tr>
		<col width="50%" />
		<col width="50%" />
		<tr>
			<th>충전Point</th>
			<th>추가혜택</th>
		</tr>
		<tr>
			<td>
				<input type="radio" name="point" id="point" value="10000">&nbsp;&nbsp;&nbsp;10,000 Point
			</td>
			<td>
				+ 1000 Point
			</td>
		</tr>
		<tr>
			<td>
				<input type="radio" name="point" id="point" value="20000">&nbsp;&nbsp;&nbsp;20,000 Point
			</td>
			<td>
				+ 2000 Point
			</td>
		</tr>
		<tr>
			<td>
				<input type="radio" name="point" id="point" value="30000">&nbsp;&nbsp;&nbsp;30,000 Point
			</td>
			<td>
				+ 3000 Point
			</td>
		</tr>
		<tr>
			<td>
				<input type="radio" name="point" id="point" value="40000">&nbsp;&nbsp;&nbsp;40,000 Point
			</td>
			<td>
				+ 4000 Point
			</td>
		</tr>
		<tr>
			<td>
				<input type="radio" name="point" id="point" value="50000">&nbsp;&nbsp;&nbsp;50,000 Point
			</td>
			<td>
				+ 5000 Point
			</td>
		</tr>
		<tr>
			<td colspan="3" style="text-align:center;">
				<input type="button" id="choice" class="choice" value="선택">
				<input type="button" id="cansel" class="choice" value="취소" style="display:none;">
			</td>
		</tr>
	</table>
	</div>
</div>

<div class="great_date2">
	<h2>&nbsp;</h2>
	<br><br>
	<div class="tbl_head01 tbl_wrap2">
	
	<table>
		<tr>
			<td colspan="3" style="text-align:center; background-color:#C1454A;">2. 무통장입금 입금은행 선택 및 입금자명 작성</td>
		</tr>
		<col width="33%"/>
		<col width="33%"/>
		<col width="33%"/>
		<tr>
			<th>입금자ID</th>
			<td colspan="2">
			    <%-- <input type = "text" readonly="readonly" value="${id}"> --%>
				<form:input path="id" value="${id}"/>
			</td>
		</tr>
		<tr>
			<th>입금자명</th>
			<td colspan="2">
				<form:input path="name" value="${memberCommand.name}"/>
			</td>
		</tr>
		<tr>
			<th>휴대폰번호</th>
			<td colspan="2">
				<form:select path="phone1" id="phone" class="joinInput-3">
					<form:option value="010">010</form:option>
					<form:option value="011">011</form:option>
					<form:option value="016">016</form:option>
					<form:option value="017">017</form:option>
					<form:option value="019">019</form:option>
				</form:select> <div class="joinTxt-5">-</div>
				<form:input path="phone2" id="phone" class="joinInput-8"/> <div class="joinTxt-5">-</div>
				<form:input path="phone3" id="phone" class="joinInput-8"/>
			</td>
		</tr>
		<tr>
			<th>계좌선택</th>
			<td colspan="2">
				<form:select path="accountnum">
					<form:option value="285504-04-0156">국민은행 285504-04-0156</form:option>
					<form:option value="335-458-225887">신한은행 335-458-225887</form:option>
					<form:option value="110-335-234544">우리은행 110-335-234544</form:option>
				</form:select>
			</td>
		</tr>
		<tr>
			<th>예금주</th>
			<td colspan="2">
				<span>우리결혼할래요</span>
			</td>
		</tr>
		<tr>
			<th>입금금액</th>
			<td colspan="2">
				<form:input path="amount" id="amount"/>
			</td>
		</tr>
	</table>
	</div>
	</div>
	

	</div>
	<div style="width:1200px;  text-align:center; padding-left:150px">
		<input type="submit" value="충전" id="btn_submit" class="btn_submit" >
        <a href="<%=request.getContextPath()%>/member/paymentList.do" class="btn_cancel">취소</a>
    </div>

   </form:form>
</div>
</div>
</div>



<script>
$(document).ready(function(){
  $(window).scroll(function () {
   if ($(this).scrollTop() > 10) { 
        $('#back-top').fadeIn();
   } else {
       $('#back-top').fadeOut();
   }
  });

  $('#back-top').click(function () {
   $('body,html').animate({
        scrollTop: 0
   }, 200);
        return false;
  });
});
</script>
<style>
#back-top {
 position: fixed;
 bottom: 100px; /* 부라우저 밑에서 위로 떨어질 높이설정  */
 left: 90%;
 margin:0px;  /* 부라우저 중앙에서 우측으로 떨어질 거리설정  */
 z-index:999;
 display:none;
}
</style>
<div id="back-top">
    <a href="#wrap"><img src="../image/all/go_top.png" width="60" height="60" alt="위로가기"></a>
</div>
<!-- } 콘텐츠 끝 -->

<hr>



<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt="" src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/967057890/?value=0&amp;label=A9o3CIaS9wcQ4sOQzQM&amp;guid=ON&amp;script=0"/>
</div>
</noscript>

</body>
</html>